<template>
    <div class="bulkManage">
        <formHeader :title="'批量管理'"></formHeader>
        <div class="content">
            <div class="checkbox">
                <div class="checkItem">
                    <div class="checkBtn">
                        <img v-if="false" src="../../assets/goodsMsg/checked.png"/>
                        <img v-else src="../../assets/goodsMsg/unchecked.png"/>
                    </div>
                    <div class="checkMsg">
                        <div class="checkImg">
                            <img src="../../assets/managaImg.png"/>
                        </div>
                        <div class="right">
                            <div class="title">产品名称产品名称</div>
                            <div class="price">￥ 12.00</div>
                            <div class="checkInfo">
                                <span class="checkInfoItem">
                                    <span class="name">总销量</span>
                                    <span class="num">0</span>
                                </span>
                                <span class="checkInfoItem">
                                    <span class="name">库存</span>
                                    <span class="num">0</span>
                                </span>
                                <br/>
                                <span class="checkInfoItem">
                                    <span class="name">退款数</span>
                                    <span class="num">0</span>
                                </span>
                                <span class="checkInfoItem">
                                    <span class="name">上架时间</span>
                                    <span class="num">2020-05-20</span>
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="bulkBtn">
            <div class="btnItem">批量上架</div>
            <div class="device">|</div>
            <div class="btnItem">批量分类</div>
        </div>
    </div>
</template>

<script>
    import formHeader from '@/components/form-header'
    export default {
        components:{formHeader},
        name : "bulkManage"
    }
</script>

<style scoped lang="stylus">
.bulkManage
    .content
        margin-top 1.44rem
    .checkbox
        .checkItem
            margin-bottom 0.27rem
            padding 0.24rem 0.40rem
            display flex
            align-items center
            background-color #fff
        .checkBtn
            img
                margin 0 0.40rem
                width 0.53rem
                hieght .53rem
    .checkMsg
        display flex
        align-items center
        justify-content space-between
        img
            width 2.19rem
            height 2.19rem
    .right
        margin-left 0.29rem
        .title
            color #333
            font-size 0.35rem
        .price
            margin-top 0.25rem
            color #00A398
            font-size 0.43rem
    .checkInfo
        .name
            color #999999
            font-size 0.29rem
            margin-right 0.15rem
        .num
            color #333
            font-size 0.37rem
        .checkInfoItem
            width 2.09rem
            display inline-block
            white-space nowrap
    .bulkBtn
        background-color #fff
        display flex
        justify-content center
        align-items center
        position fixed
        bottom 1.17rem
        .btnItem
            padding 0.48rem 0
            width 4.99rem
            text-align center
            font-size 0.37rem
            color #333
            white-space nowrap
        .device
            color #EAEAEA
            font-size 0.53rem
</style>